function pausecomp(millis) {
	var date = new Date();
	var curDate = null;

	do { curDate = new Date(); } 
	while(curDate-date < millis);
} 

var last_send = 0;
function runPhp(x,y) {
	$().ready(function () {
		var current = new Date();
		if((x == 0 && y == 0) || current-last_send > 100) {
			var url = "client_socket.php?x="+x+"&y="+y;
			console.log(url);
			$.get(url, printout);
			//pausecomp(1000);
			last_send = new Date();
		}
	});
}
function printout(data) {
	console.log(data);
}

function do_everything() {
	var stage = new Kinetic.Stage({
        container: 'container',
        width: 600,
        height: 600
    });
	
    var shapesLayer = new Kinetic.Layer();
    var group = new Kinetic.Group({
        
    });
	
	var text_x = new Kinetic.Text({
        x: 10,
        y: 10,
        text: 'x',
        fontSize: 10,
        fontFamily: 'Calibri',
        textFill: 'black'
      });
	 
	var text_y = new Kinetic.Text({
        x: 10,
        y: 30,
        text: 'y',
        fontSize: 10,
        fontFamily: 'Calibri',
        textFill: 'black'
      });
	
	
	var start_x = stage.getWidth() / 2;
	var start_y = stage.getHeight() / 2;
	
	var line1 = new Kinetic.Line({
          points: [0, start_y, stage.getWidth(), start_y],
          stroke: "green",
          strokeWidth: 2,
          lineJoin: "round",
          /*
           * line segments with a length of 33px
           * with a gap of 10px
           */
          dashArray: [5, 5]
        });
	
	
		
	var line2 = new Kinetic.Line({
          points: [start_x, 0, start_x, stage.getHeight()],
          stroke: "green",
          strokeWidth: 2,
          lineJoin: "round",
          /*
           * line segments with a length of 33px
           * with a gap of 10px
           */
          dashArray: [5, 5]
        });
		
	var circle_line = new Kinetic.Circle({
			x: start_x,
			y: start_y,
			radius: 100,//stage.getHeight() /3,
			stroke: 'green',
			strokeWidth: 3,
			lineJoin: "round",
			dashArray: [5, 5]
	});
	
	var circle_line2 = new Kinetic.Circle({
			x: start_x,
			y: start_y,
			radius: 50,//(stage.getHeight() /3)/2,
			stroke: 'green',
			strokeWidth: 1,
			lineJoin: "round",
			dashArray: [5, 5]
	});
	
	shapesLayer.add(text_x);
	shapesLayer.add(text_y);
	shapesLayer.add(line1);
	shapesLayer.add(line2);
	shapesLayer.add(circle_line);
	shapesLayer.add(circle_line2);
	
	var circle = new Kinetic.Circle({
			x: start_x,
			y: start_y,
			radius: 60,
			fill: 'green',
			stroke: 'black',
			strokeWidth: 3,
			draggable: true,
			dragBoundFunc: function(pos) {
				var x = start_x;
				var y = start_y;
				var radius = 100;//stage.getHeight() /3;
				var scale = radius / Math.sqrt(Math.pow(pos.x - x, 2) + Math.pow(pos.y - y, 2));
				if(scale < 1)
				  return {
					y: Math.round((pos.y - y) * scale + y),
					x: Math.round((pos.x - x) * scale + x)
				  };
				else
				  return pos;
			  }
	});
	
	function update_texts() {
		var x = Math.round((circle.getX()-start_x)/10)*10;
		var y = Math.round((-(circle.getY()-start_y)/10))*10;
		text_x.setText(x);
		text_y.setText(y);
		runPhp(x,y);
		stage.draw();
	}
	circle.on('dragmove', function() {
		update_texts();
	});
	circle.on('mouseover', function() {document.body.style.cursor = 'pointer';});
	circle.on('mouseup', function() {
		circle.setX(start_x);
		circle.setY(start_y);
		stage.draw();
		});
	circle.on('mouseout', function() {
		document.body.style.cursor = 'default';
		circle.setX(start_x);
		circle.setY(start_y);
		stage.draw();
	});
	
	group.add(circle);
				
	stage.on('mouseout', function() {
		circle.setX(start_x);
		circle.setY(start_y);
		stage.draw();
	});
	group.on('mouseover', function() {
		//document.body.style.cursor = 'pointer';
	});
	group.on('mouseout', function() {
		//document.body.style.cursor = 'default';
		circle.setX(start_x);
		circle.setY(start_y);
		update_texts();
	});
	shapesLayer.add(group);
	stage.add(shapesLayer);
}